<!--
 * @Author: Li Zengkun
 * @Date: 2022-09-26 17:11:48
 * @LastEditors: Li Zengkun
 * @LastEditTime: 2022-09-26 20:43:40
 * @Description: 
-->
<template>
  <div>
    <el-card shadow="hover">
      <template #header>
        <span>注册</span>
      </template>
      <el-form :model="form" :rules="rules" label-position="top">
        <el-form-item label="账户" prop="username">
          <el-input v-model="form.username"></el-input>
        </el-form-item>
        <el-form-item label="密码" prop="pwd">
          <el-input type="password" v-model="form.password"></el-input>
        </el-form-item>
        <el-form-item label="重复密码" prop="rePwd">
          <el-input type="password" v-model="form.rePassword"></el-input>
        </el-form-item>
        <el-form-item label="姓名" prop="fullname">
          <el-input type="password" v-model="form.rePassword"></el-input>
        </el-form-item>
        <el-form-item label="性别" prop="sex">
          <el-select v-model="form.sex">
            <el-option value="男">男</el-option>
            <el-option value="女">女</el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="手机号" prop="tel">
          <el-input  v-model.number="form.tel"></el-input>
        </el-form-item>
        <el-form-item label="邮箱">
          <el-input  v-model="form.email"></el-input>
        </el-form-item>
      </el-form>
      <p>
        <el-button type="primary">注册</el-button>
      </p>
      <div class="bottom">
        <el-button link @click="toLogin">登录</el-button>
        <el-button link>用户协议</el-button>
      </div>
    </el-card>
  </div>
</template>
 
<script setup>
import { ref, reactive } from "vue";
import { useRouter } from "vue-router";

const router = useRouter();

const form = ref({
  username: "",
  password: "",
  fullname: "",
  sex: "",
  tel: "",
  email: "",
});

const rules = [{}];

const toLogin = () => {
  router.push("/login");
};
</script>

<style lang='less' scoped>
</style>

